<template>
  <div>
		<el-button @click="begin">开始计时{{time}}</el-button>
    <button @click="pause">暂停</button>
  </div>
</template>
<script>
export default {
  data(){
    return {
       time: '00:00:00',
				timer: '',
				hour: 0,
				minutes: 0,
				seconds: 0

    }
  },
  methods:{
      // 开始计时
			begin() {
				this.timer = setInterval(this.startTimer, 1000);
			},
			startTimer() {
				this.seconds += 30;
				if (this.seconds >= 60) {
					this.seconds = 0;
					this.minutes = this.minutes + 1;
				}
				if (this.minutes >= 60) {
					this.minutes = 0;
					this.hour = this.hour + 1;
				}
				this.time = (this.hour < 10 ? '0' + this.hour : this.hour) + ':' + (this.minutes < 10 ? '0' + this.minutes :
					this.minutes) + ':' + (this.seconds < 10 ? '0' + this.seconds : this.seconds);
			},
      // 定时器结束
      pause() {
        if (this.timer) {
          clearInterval(this.timer);
        }

      }
    }

}
</script>

